<template>
    <div class="component-record">
        <div class="record-left">
        	<div class="record-text">
        		<span>{{text}}</span><span v-if="hasredircte"><img src="../../assets/images/trans-record.png" alt=""><span>{{dtText}}</span></span>
        	</div>
        	<div class="record-time">
        		<img src="../../assets/images/trans-time.png" alt=""><span>{{time}}</span>
        	</div>
        </div>
	    <div class="record-right">
	    	<div class="record-number">{{amount}}<span>元</span></div>
	    	<div class="record-zt">{{state}}</div>
        </div>
    </div>

</template>

<script>
export default {
    name:'home',
    props:{
    	hasredircte:{
    		type:Boolean,
    		default:false
    	},
    	text:{
    		type:String,
    		default:'本地'
    	},
    	dtText:{
    		type:String,
    		default:'AG'
    	},
        time:{}, amount:{},
    	state:{
    		 type:String,
    		default:'转账成功'
    	}

    },
    data(){
        return{
          
        }
    },
    methods:{
        test(k){
             if( k.target.datd=='true' ||  k.target.datd==undefined ){
                 k.target.innerHTML='已经关注'
                 k.target.datd=""
             }else{
                k.target.innerHTML='关注'
                k.target.datd='true'
             }
        }
    }
}
</script>

<style lang="scss" scoped>
.component-record{
	width:100%;
	display:flex;
	height:1.2rem;
	border-bottom:1px solid #e4e5e6;
	justify-content:space-between;
	padding:.2rem ;
	background:#fff;
	.record-left{
		.record-text{
			font-size:.3rem;
			// height:100%;
			color:#3b556e;
			img{
				width:.3rem;
				height:.09rem;
				margin:0 .2rem;
			}
		}
		.record-time{
				font-size:.22rem;
				color:#b8bdc0;
				margin:.1rem 0;
			img{
				width:.2rem;
				height:.2rem;
				vertical-align:middle;
				margin:.06rem .1rem 0;
				float:left;
			}
		}
	}
	.record-right{
		.record-number{
			font-size:.4rem;
			color:#f15554;
			text-align:right;
			span{
				font-size:.26rem;
			}
			
		}
		.record-zt{
				font-size:.24rem;
				text-align:right;
				color:#b8bdc0;
			}
	}
}

</style>
